<template>
  <uni-card v-if="data.forma.showScore === 'B' || data.forma.showScore === 'C'">
    <uni-row>
      <uni-col :span="24" :offset="1">
        <uni-title type="h4" color="red" :title="`考场名称：${data.forma.romName} `"></uni-title>
        <uni-title type="h4" color="red" :title="`考生姓名：${data.form.userName} `"></uni-title>
        <uni-title type="h4" color="red" :title="`考生得分：${data.form.score}  分`"></uni-title>
        <uni-title type="h4" color="red" :title="`试卷总分：${data.forma.paper.examScore}  分`"></uni-title>
        <uni-title type="h4" color="red" :title="`及格分数：${data.forma.paper.passLine}  分`"></uni-title>
      </uni-col>
    </uni-row>
  </uni-card>

  <view v-if="data.forma.showScore === 'C'">
    <uni-card v-for="(item, j) in data.form.lista">
      <uni-title class="uni-body" :title="`${j + 1}、${item.question}【${item.quesTypeName}】(${item.baseScore}分)`"></uni-title>
      <view class="card-actions">
        <view class="warp" v-if="item.quesTypeId === 1">
          <button v-for="(it, i) in item.lista" class="button" size="mini">
            {{ data.letter[i] + ':  ' + it.answer }}
          </button>
        </view>
        <view class="warp" v-if="item.quesTypeId === 2">
          <button v-for="(it, i) in item.lista" class="button" size="mini">
            {{ data.letter[i] + ':  ' + it.answer }}
          </button>
        </view>
        <view class="warp" v-if="item.quesTypeId === 3">
          <button v-for="(it, i) in item.lista" class="button" size="mini">
            {{ it.answer }}
          </button>
        </view>
        <view class="warp" v-if="item.quesTypeId === 4">
          <button v-for="(it, index) in item.lista" class="button" size="mini" >
            {{ it.answer }}
          </button>
        </view>
      </view>

      <view class="card-actions">
        <uni-row>
          <uni-tag size="mili" v-if="item.corrent" :inverted="true" type="success" text="答对了"></uni-tag>
          <uni-tag size="mili" v-else :inverted="true" type="error" text="答错了"></uni-tag>
        </uni-row>
        <uni-row>
          <uni-title type="h5" :title="`考生得分：${item.score} `"></uni-title>
        </uni-row>
      </view>
    </uni-card>
  </view>

  <uni-fab
    :pattern="data.pattern"
    :content="data.content"
    :horizontal="data.horizontal"
    :vertical="data.vertical"
    :direction="data.direction"
    @fabClick="back"
  ></uni-fab>
</template>

<script setup>
  import { reactive } from 'vue';
  import { onShow } from '@dcloudio/uni-app';
  import { examromaApi } from '@/api/business/exam/exrom-api';
  import { examromApi } from '../../api/business/exam/exrom-api';

  const props = defineProps({
    docEntry: String,
  });

  const data = reactive({
    form: {
      userName: '',
      score: '',
      scoreSort: '1',
      totalNum: 1,
    },
    forma: {
      showScore: 'A',
      paper: {
        examScore: 0,
        passLine: 0,
      },
    },
    scrollTop: 0,
    title: 'uni-fab',
    directionStr: '垂直',
    horizontal: 'right',
    vertical: 'bottom',
    direction: 'horizontal',
    letter: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L'],
    pattern: {
      icon: 'redo',
      color: '#7A7E83',
      backgroundColor: '#fff',
      selectedColor: '#007AFF',
      buttonColor: '#007AFF',
      iconColor: '#fff',
    },
    is_color_type: false,
  });

  function queryList() {
    examromaApi.myInfo(props.docEntry).then((res) => {
      data.form = res.data;
      uni.hideLoading();
    });
    examromApi.myInfo(props.docEntry).then((res) => {
      data.forma = res.data;
    });
  }

  function scroll(e) {
    data.scrollTop = e.detail.scrollTop;
  }

  onShow(() => {
    queryList();
    uni.showLoading({
      title: '加载中',
      mask: true,
    });
  });

  function extarChange(item) {
    if (item.quesTypeId === 1) {
      return '单选题';
    } else if (item.quesTypeId === 2) {
      return '多选题';
    } else if (item.quesTypeId === 3) {
      return '判断题';
    } else if (item.quesTypeId === 4) {
      return '填空题';
    }
  }

  function back() {
    uni.switchTab({ url: '/pages/exrom/exrom' });
  }
</script>
<style scoped>
  .warp > .button {
    width: 100%;
    text-align: left;
  }

  .uni-forms-item {
    margin-bottom: 4rpx;
  }

  .uni-title__box {
    padding: 0;
  }

  .card-actions {
    padding-top: 10px;
    border-top: 1px #eee solid;
  }
</style>
